<label for="search">Search heroes: </label>
<input type="text" id="search" #criteria
  (input)="updateCriteria(criteria.value)"
  placeholder="Search heroes">

<ul class="heroes" [@filterAnimation]="heroesTotal">
  <li *ngFor="let hero of heroes;trackBy:trackById" class="hero">
    <div class="inner">
      <span class="badge">{{ hero.id }}</span>|
      <span class="name">{{ hero.name }}</span>|
      <span class="name">{{ hero.description }}</span>
    </div>
  </li>
</ul>